// 全局变量
let conversationHistory = [];
const API_BASE_URL = 'http://localhost:8000';

// DOM 元素
const chatMessages = document.getElementById('chat-messages');
const userInput = document.getElementById('user-input');
const sendBtn = document.getElementById('send-btn');
const clearChatBtn = document.getElementById('clear-chat');

// 初始化事件监听器
function initEventListeners() {
    // 发送按钮点击事件
    sendBtn.addEventListener('click', sendMessage);
    
    // 输入框回车事件
    userInput.addEventListener('keypress', (e) => {
        if (e.key === 'Enter' && !e.shiftKey) {
            e.preventDefault();
            sendMessage();
        }
    });
    
    // 清空聊天按钮点击事件
    clearChatBtn.addEventListener('click', clearChat);
    
    // 输入框输入事件，控制发送按钮状态
    userInput.addEventListener('input', () => {
        sendBtn.disabled = userInput.value.trim() === '';
    });
}

// 发送消息
async function sendMessage() {
    const message = userInput.value.trim();
    
    if (!message) return;
    
    // 清空输入框并禁用发送按钮
    userInput.value = '';
    sendBtn.disabled = true;
    
    // 添加用户消息到界面
    addMessageToUI('user', message);
    
    // 显示加载状态
    const loadingElement = addLoadingIndicator();
    
    try {
        // 调用API
        const response = await callChatAPI(message);
        
        // 移除加载状态
        if (loadingElement && loadingElement.parentNode) {
            loadingElement.parentNode.removeChild(loadingElement);
        }
        
        // 添加机器人回复到界面
        addMessageToUI('bot', response);
        
        // 更新对话历史
        conversationHistory.push({ role: 'user', content: message });
        conversationHistory.push({ role: 'assistant', content: response });
        
    } catch (error) {
        // 移除加载状态
        if (loadingElement && loadingElement.parentNode) {
            loadingElement.parentNode.removeChild(loadingElement);
        }
        
        // 显示错误消息
        addMessageToUI('bot', `抱歉，出现了错误：${error.message || '未知错误'}`);
        
        console.error('API调用错误:', error);
    }
}

// 调用聊天API
async function callChatAPI(message) {
    try {
        const response = await fetch(`${API_BASE_URL}/chat`, {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
            },
            body: JSON.stringify({
                message: message,
                conversation_history: conversationHistory
            })
        });
        
        if (!response.ok) {
            throw new Error(`HTTP错误! 状态码: ${response.status}`);
        }
        
        const data = await response.json();
        return data.response;
        
    } catch (error) {
        // 处理网络错误或API调用错误
        if (error.name === 'TypeError' && error.message.includes('Failed to fetch')) {
            throw new Error('无法连接到服务器，请检查后端服务是否已启动。');
        }
        throw error;
    }
}

// 添加消息到界面
function addMessageToUI(sender, message) {
    const messageDiv = document.createElement('div');
    messageDiv.classList.add('message', sender);
    
    const contentDiv = document.createElement('div');
    contentDiv.classList.add('message-content');
    contentDiv.textContent = message;
    
    const timeDiv = document.createElement('div');
    timeDiv.classList.add('message-time');
    const now = new Date();
    timeDiv.textContent = `${now.getHours().toString().padStart(2, '0')}:${now.getMinutes().toString().padStart(2, '0')}`;
    
    messageDiv.appendChild(contentDiv);
    messageDiv.appendChild(timeDiv);
    
    chatMessages.appendChild(messageDiv);
    
    // 滚动到底部
    chatMessages.scrollTop = chatMessages.scrollHeight;
}

// 添加加载指示器
function addLoadingIndicator() {
    const loadingDiv = document.createElement('div');
    loadingDiv.classList.add('message', 'bot');
    
    const loadingContent = document.createElement('div');
    loadingContent.classList.add('message-content');
    
    const loadingIndicator = document.createElement('div');
    loadingIndicator.classList.add('loading');
    loadingIndicator.innerHTML = '<span></span><span></span><span></span>';
    
    loadingContent.appendChild(loadingIndicator);
    loadingDiv.appendChild(loadingContent);
    
    chatMessages.appendChild(loadingDiv);
    
    // 滚动到底部
    chatMessages.scrollTop = chatMessages.scrollHeight;
    
    return loadingDiv;
}

// 清空聊天
function clearChat() {
    // 清空对话历史
    conversationHistory = [];
    
    // 清空界面消息，保留欢迎消息
    chatMessages.innerHTML = `
        <div class="welcome-message">
            <p>欢迎使用ChatGPT！请在下方输入您的问题。</p>
        </div>
    `;
}

// 初始化应用
function initApp() {
    initEventListeners();
    sendBtn.disabled = true; // 初始禁用发送按钮
    
    // 检查本地存储中的对话历史（可选功能）
    const savedHistory = localStorage.getItem('chatHistory');
    if (savedHistory) {
        try {
            conversationHistory = JSON.parse(savedHistory);
            // 可以在这里恢复之前的对话（可选）
        } catch (e) {
            console.error('解析聊天历史失败:', e);
        }
    }
}

// 当页面加载完成后初始化应用
window.addEventListener('DOMContentLoaded', initApp);